<!--
 * @Author: 吴世扬 18368095041@163.com
 * @Date: 2024-07-16 10:03:49
 * @LastEditors: 吴世扬 18368095041@163.com
 * @LastEditTime: 2024-08-22 17:57:33
 * @FilePath: /vue3-uniapp/src/pages/auth/LoginView/components/WxLogin.vue
-->
<script lang="ts" setup>
import type { ButtonOnGetphonenumber } from '@uni-helper/uni-types';

import { isError } from '@/utils/assert';
import { useLogin } from '@/service/useLogin';
import { useNotifySubject } from '@/service/app/useNotifySubject';

const emits = defineEmits<{
    (event: 'submit', token: string): void;
}>();
const goHome = () => {
    uni.$uv.route({
        type: 'switchTab',
        url: '/pages/tabbar/HomeView/HomeView'
    });
};
const { wxLoginLoading, wxLogin } = useLogin();

const { danger } = useNotifySubject();

const handleLogin: ButtonOnGetphonenumber = async (event) => {
    try {
        const { detail } = event;
        const code = detail.code;
        if (!code) {
            throw new Error('无法获取微信绑定的手机号');
        }
        const token = await new Promise<string>((resolve, reject) => {
            uni.login({
                success(res) {
                    if (res.code) {
                        wxLogin({
                            jsCode: res.code,
                            mobileCode: code
                        }).then((res) => {
                            const token = res?.data;
                            if (!token)
                                return reject(new Error('无法获取token'));
                            resolve(token);
                        });
                    } else {
                        reject(new Error('微信登录失败'));
                    }
                },
                fail(res) {
                    reject(new Error('微信登录失败'));
                }
            });
        });
        emits('submit', token);
    } catch (e) {
        console.log(e);
        if (isError(e)) {
            danger({
                msg: e.message
            });
        }
    }
};

const exitMiniProgram = () => {
    wx.exitMiniProgram({});
};
</script>

<template>
    <view class="wx-login-container">
        <div style="margin-bottom: 80rpx" class="text-sm c-text text-center">
            同意授权获取手机号登录？
        </div>
        <div
            style="margin-bottom: 80rpx"
            class="flex flex-row items-center justify-around"
        >
            <button
                style="width: 50%; margin-right: 20rpx"
                class="text-sm"
                @click="goHome"
            >
                暂不登录
            </button>
            <button
                style="width: 50%"
                class="bg-primary text-sm c-white"
                open-type="getPhoneNumber"
                @getphonenumber="handleLogin"
            >
                同意
            </button>
        </div>
        <div style="margin-bottom: 40rpx">
            <button class="text-sm" @tap="exitMiniProgram">拒绝并退出</button>
        </div>
        <!--        <view style="margin-bottom: 80rpx">
            <button
                class="loginbtn bg-primary fs-s c-white"
                open-type="getPhoneNumber|agreePrivacyAuthorization"
                @getphonenumber="handleLogin"
                @agreeprivacyauthorization="handleAgreeprivacyauthorization"
                v-if="checkbox[0]"
            >
                同意隐私协议并授权手机号登录
            </button>
            <button
                class="loginbtn bg-primary fs-s c-white"
                v-else
                @tap="examineFn"
            >
                同意隐私协议并授权手机号登录
            </button>
        </view> -->

        <!--        <view class="flex flex-row ai-center" style="margin-bottom: 30rpx">
            <u-checkbox-group v-model="checkbox" placement="row">
                <u-checkbox
                    shape="circle"
                    size="32rpx"
                    :name="true"
                ></u-checkbox>
            </u-checkbox-group>
            <text class="c-text3 fs-s" @tap="changeCheckbox">
                我已阅读并同意
            </text>
            <text
                class="c-blue fs-s"
                @tap.stop="
                    () => $u.route('packageCommon/pages/agreement/index?type=1')
                "
            >
                《用户协议》
            </text>
        </view> -->
    </view>
</template>

<style lang="scss">
.wx-login-container {
    padding: 0 48rpx;

    .loginbtn {
        width: 654rpx;
        height: 96rpx;
        border-radius: 16rpx;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }
}
</style>
